package com.csw.compose.ui.module.component.base

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.foundation.verticalScroll
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Close
import androidx.compose.material.icons.filled.Person
import androidx.compose.material3.Icon
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import com.csw.compose.theme.pagePadding
import com.csw.compose.ui.Destination
import com.csw.compose.ui.components.BodyText
import com.csw.compose.ui.components.LabelText
import com.csw.compose.ui.components.NormalSpacer
import com.csw.compose.ui.components.PrimaryTitle
import com.csw.compose.ui.components.UlItem
import com.csw.compose.ui.module.BasePage

@Preview
@Composable
fun TextFieldPagePreview() {
    BasePage({}, "文本输入（TextField）") {
        TextFieldPage()
    }
}

class TextFieldPageData {
    companion object : Destination("TextFieldPage")
}

/**
 * [参考](https://developer.android.google.cn/develop/ui/compose/text/user-input?hl=zh-cn)
 */
@Composable
fun TextFieldPage() {
    Column(
        modifier = Modifier
            .padding(horizontal = pagePadding)
            .verticalScroll(rememberScrollState())
    ) {
        PrimaryTitle("简介")
        BodyText("文本输入框，以下介绍各种样式的对话框")

        NormalSpacer()
        BasicTextField("BasicTextField", {})
        UlItem("BasicTextField")
        LabelText("基础的文本输入框，等同于可输入的TextView，没有任何装饰、提示")

        NormalSpacer()
        TextField("TextField", {}, label = { Text("UserName", color = Color.Gray) },
            leadingIcon = {
                Icon(Icons.Filled.Person, "Account")
            },
            trailingIcon = {
                Icon(Icons.Filled.Close, "Clear")
            })
        TextField("", {}, label = { Text("UserName", color = Color.Gray) },
            leadingIcon = {
                Icon(Icons.Filled.Person, "Account")
            },
            trailingIcon = {
                Icon(Icons.Filled.Close, "Clear")
            })
        UlItem("TextField")
        LabelText("文本输入框，类似EditText，支持很多参数设置，最常见的当然是输入提示，在无输入时居中显示，输入内容后置顶显示并伴随动画")

        NormalSpacer()
        OutlinedTextField("OutlinedTextField", {}, label = { Text("UserName", color = Color.Gray) })
        OutlinedTextField("", {}, label = { Text("UserName", color = Color.Gray) })
        UlItem("OutlinedTextField")
        LabelText("文本输入框边框版，输入提示会移动到边框上")
    }
}
